<template>
  <div>
    <van-cell-group>
      <van-cell title="退出登录" v-on:click="logOut"></van-cell>
      <van-cell title="我的订单" isLink>
        <router-link to="/shop/OrderSpeed" class="text-desc">全部订单</router-link>
      </van-cell>


    </van-cell-group>

  </div>
</template>

<script>
  import { Dialog } from 'vant';
import { Row, Col } from 'vant';
  import {ApiService} from "../../axios/apiService";
const outLogin = new ApiService("/outLogin");
export default {

  name: 'user-order',
  data() {
    return {
      order: []
    };
  },
  methods: {
    logOut(){//弹出确认框
      Dialog.confirm({
        title: '退出登录',
        message: '',
      })
              .then(() => {
                console.log("退出登录")
                console.log(outLogin.getCookie("userid"));
                //设置用户id为空，并设置过期时间（当前时间之前）,以删除cookie
                document.cookie="userid=; expires=Thu, 18 Dec 2000 12:00:00 GMT";
                //TODO  退出登录失败
                console.log(outLogin.getCookie("userid"));
                this.$router.push('/');
              })
              .catch(() => {
                console.log("取消")
                // on cancel
              });
    }

  },
  components: {
    [Row.name]: Row,
    [Col.name]: Col
  }
};
</script>


<style scoped lang="scss">
@import '../../assets/scss/mixin';
.order_status {
  background-color: #fff;
  text-align: center;
  padding: 10px 0;
  font-size: 12px;

   div {
    &::after {
      top: 50%;
      left: 50%;
      border-bottom: 0;
      border-right: 1px solid;
      height: 150%;
      transform: scale(0.5) translate3d(-50%, -50%, 0);
      transform-origin: 0 0;
    }
    &:last-child::after {
      border: 0;
    }
  }

  .order_status_icon {
    position: relative;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: inline-block;
    i {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate3d(-50%, -50%, 0);
      font-size: 24px;
      color: #000;
    }
  }
}
</style>
